<template>
	<view class="Login">
		<view class="LoginBox" v-if="type==1">
			<view class="FormBox">
				<view class="Logintitle">欢迎登录若免</view>
				<view class="inputBox">
					<input class="input" :type="type1" placeholder="请输入手机号" v-model="mobile"/>
					<view @click="emptyBtn">
						<u-icon name="close-circle" size="30" color="#707070"></u-icon>
					</view>
				</view>
				<view class="inputBox">
					<input class="input" :type="type2" placeholder="请输入密码" v-model="password"/>
					<view @click="hideBtn">
						<u-icon name="eye-fill" size="30" color="#707070"></u-icon>
					</view>
				</view>
				<view class="modeBox">
					<view></view>
					<view class="otherLogin">
						<view class="otherItem" @click="toVerifyLogin">验证码登录</view>
						<view class="otherItem" @click="toForgetPassword">忘记密码？</view>
						<view class="otherItem" @click="toRegister">立即注册</view>
					</view>
				</view>
				<view class="loginBtn" @click="nowLogin">登录</view>
				<view style="font-size: 28upx;margin-top: 30upx;text-align: center;" @click="toUserXy">登录即代表您已同意<text style="color: #409EFF;">《用户服务协议》</text></view>
			</view>
		</view>
<!--		<view class="IconBox" v-if="type==1">-->
<!--			<view class="tips">——第三方登录——</view>-->
<!--			<view class="IconItemBox">-->
<!--				<button class="IconItem" @click="weixinLogin">-->
<!--					<u-icon name="weixin-fill" size="45" color="#07C160"></u-icon>-->
<!--				</button>-->
<!--			</view>-->
<!--		</view>-->
		<view class="LoginBox" v-if="type==2">
			<view class="FormBox">
				<view class="Logintitle">欢迎登录若免</view>
				<view class="inputBox">
					<input class="input" type="number" placeholder="请输入手机号" v-model="mobile"/>
					<view @click="emptyBtn">
						<u-icon name="close-circle" size="30" color="#707070"></u-icon>
					</view>
				</view>
				<view class="inputBox">
					<input class="input" type="text" placeholder="请输入验证码" v-model="password"/>
					<view style="width: 200upx;text-align: end;color:#409EFF" @click="getCode">{{codeText}}</view>
					<u-verification-code ref="uCode" @change="codeChange"></u-verification-code>
				</view>
				<!-- <view class="modeBox">
					<view></view>
					<view class="otherLogin">
						<view class="otherItem" @click="toLogin">密码登录</view>
						<view class="otherItem" @click="toForgetPassword">忘记密码？</view>
						<view class="otherItem" @click="toRegister">立即注册</view>
					</view>
				</view> -->
				<view class="loginBtn" @click="toLoginByPhone">登录</view>
				<view style="font-size: 28upx;margin-top: 30upx;text-align: center;" @click="toUserXy">登录即代表您已同意<text style="color: #409EFF;">《用户服务协议》</text></view>
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	const app = getApp();
	export default {
		data() {
			return {
				mobile:'',
				password:'',
				type1:"number",
				type2:"password",
				codeText:'',
				userInfo:{},
				userNum:"",
				type:1,
			}
		},
		methods: {
			toUserXy(){
				uni.navigateTo({
					url:"/pages/pageone/pages/About-us/About-us?index=2"
				})
			},
			codeChange(text) {
				this.codeText = text;
			},
			getCode() {
				if(this.$refs.uCode.canGetCode) {
					let obj = {};
					obj.mobile = this.mobile;
					obj.type = 4;
					if(!this.mobile){
						this.$refs.uToast.show({
							type:"error",
							title:"请输入手机号",
							duration:2000
						})
						return false;
					}
					console.log(app.$vm.globalData)
					if(!app.$vm.globalData.phoneReg.test(this.mobile)){
						this.$refs.uToast.show({
							type:"error",
							title:"请输入正确的手机号",
							duration:2000
						})
						return false;
					}
					uni.showLoading({
						title: '正在获取验证码'
					})
					this.$u.api.sendMessage(obj).then(res=>{
						//console.log(res)
						uni.hideLoading();
						this.$refs.uToast.show({
							type:"success",
							title:"发送成功",
							duration:2000
						})
						this.$refs.uCode.start();
					})
				}else {
					this.$u.toast('倒计时结束后再发送');
				}
			},
			toLoginByPhone(){
				let obj = {};
				obj.headimgurl = this.userInfo.avatarUrl;
				obj.username = this.userInfo.nickName;
				obj.mobile = this.mobile;
				obj.code = this.password;
				obj.userNum = this.userNum;
				// #ifdef APP
				obj.cid = app.$vm.globalData.pushObj.clientid;
				// #endif
				let newObj = {};
				newObj.userNum = this.userNum;
				newObj.data = obj;
				console.log(obj)
				this.$u.api.loginBindingMobile(obj).then(res=>{
					this.$refs.uToast.show({
						title:"登录成功",
						type:"success",
						duration:2000
					})
					this.$u.http.setConfig({
						header: {
							'token': res.token
						}
					})
					uni.setStorageSync("rmToken",res.token);
					uni.setStorageSync("userId",res.user_id);
					app.$vm.getLocation();
					app.$vm.liaotianLogin();
					let obj = {};
					obj.username = res.username;
					obj.token = res.token;
					obj.user_id = res.user_id;
					obj.image_url = res.image_url;
					console.log(obj)
					uni.setStorageSync("rmUser",obj);
					// console.log(app.$vm.createConnect())
					// app.$vm.createConnect();
					setTimeout(()=>{
						if (app.$vm.globalData.type == 'cp') {
							uni.redirectTo({
								url: "/pages/pageone/pages/ActivityDetails/ActivityDetails?id=" + app.$vm.globalData
									.cpid
							})
						}else if (app.$vm.globalData.type == 'tg') {
							uni.redirectTo({
								url: "/pages/pagethree/pages/OfferDetails/OfferDetails?id=" + app.$vm.globalData.tgid
							})
						}else if (app.$vm.globalData.type == 'tpnr') {
							uni.redirectTo({
								url: "/pages/pagetwo/pages/FindDetail/FindDetail?id=" + app.$vm.globalData.nrid
							})
						}else if (app.$vm.globalData.type == 'spnr') {
							uni.redirectTo({
								url: "/pages/pagefive/pages/VideoDetail/VideoDetail?id=" + app.$vm.globalData.nrid
							})
						}else{
							uni.switchTab({
								url:"/pages/tabbar/index/index"
							})
						}
					},1500)
				})
			},
			weixinLogin() {
				let _this = this;
				// #ifdef APP-PLUS
				uni.login({
					provider: 'weixin',
					success: function(loginRes) {
						console.log('-------获取openid(unionid)-----');
						console.log(loginRes);
						// 获取用户信息
						uni.getUserInfo({
							provider: 'weixin',
							success: function(infoRes) {
								console.log('-------获取微信用户所有-----');
								console.log(infoRes);
								let obj = {};
								obj.unionid = infoRes.userInfo.unionId;
								obj.openid = infoRes.userInfo.openId;
								obj.nickname = infoRes.userInfo.nickName;
								obj.headimgurl = infoRes.userInfo.avatarUrl;
								// #ifdef APP
								obj.cid = app.$vm.globalData.pushObj.clientid;
								// #endif
								_this.userInfo = infoRes.userInfo;
								_this.$u.api.wxAppLogin({data:obj}).then(res=>{			  
								_this.$refs.uToast.show({
									type:"success",
									title:"登录成功",
									duration:2000
								})
								_this.$u.http.setConfig({
									header: {
										'token': res.token
									}
								})
								uni.setStorageSync("rmToken",res.token);
								uni.setStorageSync("userId",res.user_id);
								app.$vm.getLocation();
                			    app.$vm.liaotianLogin();
								let obj = {};
								obj.username = res.username;
								obj.token = res.token;
								obj.user_id = res.user_id;
								obj.image_url = res.image_url;
								console.log(obj)
								uni.setStorageSync("rmUser",obj);
								console.log(app.$vm.createConnect())
								app.$vm.createConnect();
								setTimeout(()=>{
									if (app.$vm.globalData.type == 'cp') {
										uni.redirectTo({
											url: "/pages/pageone/pages/ActivityDetails/ActivityDetails?id=" + app.$vm.globalData
												.cpid
										})
									}else if (app.$vm.globalData.type == 'tg') {
										uni.redirectTo({
											url: "/pages/pagethree/pages/OfferDetails/OfferDetails?id=" + app.$vm.globalData.tgid
										})
									}else if (app.$vm.globalData.type == 'tpnr') {
										uni.redirectTo({
											url: "/pages/pagetwo/pages/FindDetail/FindDetail?id=" + app.$vm.globalData.nrid
										})
									}else if (app.$vm.globalData.type == 'spnr') {
										uni.redirectTo({
											url: "/pages/pagefive/pages/VideoDetail/VideoDetail?id=" + app.$vm.globalData.nrid
										})
									}else{
										uni.switchTab({
											url:"/pages/tabbar/index/index"
										})
									}
								},1500)
								}).catch(err=>{
									console.log(err)
									if(err.message=="请绑定手机账号"){
										_this.type = 2;
										_this.userNum = err.data;
									}
								})
							}
						});
					},
					fail: function(res) {
						console.log("App微信获取用户信息失败", res);
					}
				});
				// #endif
			},
			nowLogin(){
				let obj = {};
				obj.mobile = this.mobile;
				obj.password = this.password;
				// #ifdef APP
				obj.cid = app.$vm.globalData.pushObj.clientid;
				// #endif
				if(!this.mobile){
					this.$refs.uToast.show({
						type:"error",
						title:"请输入手机号",
						duration:2000
					})
					return false;
				}
				if(!app.$vm.globalData.phoneReg.test(this.mobile)){
					
					this.$refs.uToast.show({
						type:"error",
						title:"请输入正确的手机号",
						duration:2000
					})
					
					return false;
				}
				if(!this.password){
					this.$refs.uToast.show({
						type:"error",
						title:"请输入密码",
						duration:2000
					})
					return false;
				}
				this.$u.api.login(obj).then(res=>{
					this.$refs.uToast.show({
						type:"success",
						title:"登录成功",
						duration:2000
					})
					this.$u.http.setConfig({
						header: {
							'token': res.token
						}
					})
					uni.setStorageSync("rmToken",res.token);
					uni.setStorageSync("userId",res.user_id);
					app.$vm.getLocation();
		 			app.$vm.liaotianLogin();
					let obj = {};
					obj.username = res.username;
					obj.token = res.token;
					obj.user_id = res.user_id;
					obj.image_url = res.image_url;
					uni.setStorageSync("rmUser",obj);
					// #ifdef APP
					// uni.switchTab({
					// 			url:"/pages/tabbar/index/index"
					// 		})
          setTimeout(()=>{
            uni.navigateBack({
              delta:1
            })
          },1500)
					// #endif
					setTimeout(()=>{
						if (app.$vm.globalData.type == 'cp') {
							uni.redirectTo({
								url: "/pages/pageone/pages/ActivityDetails/ActivityDetails?id=" + app.$vm.globalData
									.cpid
							})
						}else if (app.$vm.globalData.type == 'tg') {
							uni.redirectTo({
								url: "/pages/pagethree/pages/OfferDetails/OfferDetails?id=" + app.$vm.globalData.tgid
							})
						}else if (app.$vm.globalData.type == 'tpnr') {
							uni.redirectTo({
								url: "/pages/pagetwo/pages/FindDetail/FindDetail?id=" + app.$vm.globalData.nrid
							})
						}else if (app.$vm.globalData.type == 'spnr') {
							uni.redirectTo({
								url: "/pages/pagefive/pages/VideoDetail/VideoDetail?id=" + app.$vm.globalData.nrid
							})
						}else{
							uni.switchTab({
								url:"/pages/tabbar/index/index"
							})
						}
					},1500)
					
				})
			},
			toRegister(){
				uni.redirectTo({
					url:"/pages/pagefour/pages/Register/Register"
				})
			},
			//忘记密码
			toForgetPassword(){
				// uni.redirectTo({
				// 	url:"/pages/pagetwo/pages/ForgetPassword/ForgetPassword"
				// })
        uni.redirectTo({
					url:"/pages/pageone/pages/ChangePassword/ChangePassword"
				})
			},
			//验证码登录
			toVerifyLogin(){
				uni.redirectTo({
					url:"/pages/pagefive/pages/VerifyLogin/VerifyLogin"
				})
			},
			emptyBtn(){
				this.mobile = ''
			},
			hideBtn(){
				if(this.type2=="password"){
					this.type2 = "text"
				}else{
					this.type2 = "password"
				}
			}
		}
	}
</script>

<style scoped lang="less">
	.IconBox {
		display: flex;
		flex-direction: column;
		align-items: center;
		position: fixed;
		bottom: 64upx;
		left: 50%;
		transform: translateX(-50%);
	
		.tips {
			font-size: 20upx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #D0D0D0;
			margin-bottom: 32upx;
		}
	
		.IconItemBox {
			display: flex;
			align-items: center;
	
			.IconItem {
				display: flex;
				justify-content: center;
				align-items: center;
			}
	
			.IconItem:nth-child(3n+1) {
				width: 72upx;
				height: 72upx;
				background: #E8F8EB;
				border-radius: 50%;
				opacity: 1;
				margin-right: 32upx;
			}
	
			.IconItem:nth-child(3n+2) {
				width: 72upx;
				height: 72upx;
				background: #E7F3FF;
				border-radius: 50%;
				opacity: 1;
				margin-right: 32upx;
			}
	
			.IconItem:nth-child(3n+3) {
				width: 72upx;
				height: 72upx;
				background: #FFE6EC;
				border-radius: 50%;
				opacity: 1;
			}
		}
	}
	
	
.status_bar{
	height: var(--status-bar-height);
	width: 100%;
}
.Login{
	// padding-top: 88upx;
	.LoginBox{
		padding: 64upx 112upx;
		.FormBox{
			display: flex;
			flex-direction: column;
			// justify-content: center;
			.Logintitle{
				font-size: 48upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: #333333;
				text-align: center;
				margin-bottom: 80upx;
			}
			.inputBox{
				width: 100%;
				display: flex;
				align-items: center;
				padding: 32upx 0;
				border-bottom: 2upx solid #EFEFEF;
				.input{
					width: calc(100% - 64upx);
					font-size: 28upx;
					border: 0;
					outline: 0;
					color: #555555;
				}
			}
			.modeBox{
				display: flex;
				justify-content: space-between;
				align-items: center;
				padding: 24upx 0;
				.otherLogin{
					display: flex;
					align-items: center;
					.otherItem{
						font-size: 20upx;
						font-family: Source Han Sans CN;
						font-weight: 400;
						color: #999999;
						margin-left: 32upx;
					}
				}
			}
			.loginBtn{
				width: 526upx;
				height: 92upx;
				background: #FFAC3F;
				opacity: 1;
				border-radius: 46upx;
				font-size: 28upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				line-height: 92upx;
				text-align: center;
				color: #FFFFFF;
				margin-top: 48upx;
			}
		}
	}
}
</style>
